<template>
  <div
    v-if="notification"
    class="notification is-light py-3 px-3 is-size-7"
    :class="{ 'is-primary': darMode, 'is-info': !darMode }"
  >
    {{ notification }}
  </div>
</template>

<script>
import useDarkMode from '../hooks/useDarkMode'

export default {
  name: 'Notification',
  props: ['notification'],
  setup() {
    const { darMode } = useDarkMode()

    return {
      darMode,
    }
  },
}
</script>
